<style scoped>
  .sure {
    width: 15%;
    margin-left: 15px;
    vertical-align: text-top;
  }

  .list {
    padding-bottom: 1rem;
    position: relative;
  }

  .moren {
    width: 35%;
  }

  .list_btn {
    width: 60%;
    position: absolute;
    top: 0;
    right: 0
  }

  .list_btn span {
    margin-left: 25%
  }
</style>
<template>
  <div>
    <x-header style="background-color:#f7fcf6;" :left-options="{backText:'',showBack: true}">收货地址管理</x-header>
    <div v-for="item in address" @click="selectadress(item)">
      <group>
        <cell :title="item.name+' '+item.phone" value=""
              :inline-desc='item.province+item.city+item.area+item.address' is-link>
        </cell>
        <div class="list">
          <div class="moren" v-show="item.isDefault"><img src="../assets/img/sure.png" class="sure">默认地址</div>
          <div class="moren" style="text-align: center;" v-show="!item.isDefault"
               v-on:click.stop.prevent="setmoren(item.id)">设为默认
          </div>
          <div class="list_btn">
            <span v-on:click.stop.prevent="delet(item)">删除</span>
            <span v-on:click.stop.prevent="edit(item)">编辑</span>
          </div>
        </div>
      </group>
    </div>
    <x-button @click.native="addadress" style="position:fixed;bottom:0">添加新地址</x-button>
    <toast v-model="success">{{message}}</toast>
    <toast v-model="error" type="warn">{{errorMessage}}</toast>
  </div>
</template>
<script>
  import {XHeader, Cell, Group, XButton, Toast} from 'vux'
  import common from '../services/common';
  export default {
    data() {
      return {
        message: "成功",
        errorMessage: "失败",
        success: false,
        error: false,
        form: {
          "memberId": "",
          "offSet": 0,
          "pageSize": 5,
          "orderDirection": "desc"
        },
        address: [],
        edits: {
          id: "",
          memberId: "",
          type: 1,
          receiver: "",
          province: "",
          city: "",
          area: "",
          address: "",
          mobile: "",
          isDefault: "",
          alias: "",
          telphone: ""
        }
      }
    },
    components: {
      XHeader,
      Cell,
      Group,
      XButton,
      Toast
    },
    mounted: function () {
      //初始化是数据
      document.title = "收货地址管理"
      /*if (common.checkLogin()) {*/

      common.post(common.getRequestData("myAddress", this.form), (res) => {
        if (res.data.responseCode == '0000') {
          this.address = res.data.data;
        } else {
          this.error = true;
          this.errorMessage = res.data.responseMsg
        }
      }, false);

      /*} else {
       this.message = "正在登陆..."
       this.show1 = true;
       common.setStorage('auth_success_redirect_to', location.href);
       location.replace('http://yirenyiti.gaozhikeji.com/daiyan/wx/entrance?type=' + encodeURIComponent('auth.html?type=0'));
       this.show1 = false;
       }*/
    },
    methods: {
      //设为默认地址
      setmoren(id){
        API.user.setDefaultAddress({"id": id}).then(
          (resp) => {
            location.reload()
          }
        )
      },
      //添加地址
      addadress(){
        this.$router.push('/new_adress')
      },
      //删除地址
      delet(item){

      },
      //编辑地址
      edit(item){
        this.edits.id = item.id
        this.edits.receiver = item.receiver
        this.edits.mobile = item.mobile
        this.edits.province = item.province
        this.edits.city = item.city
        this.edits.area = item.area
        this.edits.address = item.address
        this.edits.isDefault = item.isDefault
        this.edits.alias = item.alias
        this.edits.telphone = item.telphone
        this.edits.memberId = JSON.parse(localStorage.getItem("login")).id
        localStorage.setItem("edits", JSON.stringify(this.edits));
        window.location.href = "/new_adress"
        localStorage.removeItem("receivers")
      },
      selectadress(item){
        if (localStorage.getItem("goods")) {
          common.setStorage("currAdress", JSON.stringify(item));
          this.$router.push('/order')
        }
      },
    }
  }
</script>
